<template>
  <div class="app-container">
    <div style="text-align: center">{{createStatus?'添加':'更新'}}维保信息</div>
    <div style="text-align: center;margin-bottom: 30px">
    </div>
    <div style="width: 50%;margin:0px auto;vertical-align:middle;height:100%">
      <el-form :model="recordsFrom" ref="recordsFrom" :rules="recordsFromRules" label-width="100px">

        <el-form-item label="维保人员" prop="userId" >
          <el-select v-model="recordsFrom.userId" placeholder="维保人员" style="width: 100%">
            <el-option v-for="(item,index) in userList" :key="index"  :value="item.ucId" :label="item.name" ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="业主企业" prop="enterpriseId" >
          <el-select v-model="recordsFrom.enterpriseId" placeholder="请选择企业" style="width: 100%" @change="getEquipmentList">
            <el-option v-for="(item,index) in enterpriseList" :key="index"  :value="item.ucId" :label="item.name" ></el-option>
          </el-select>
        </el-form-item>

        <el-form-item label="设备" prop="equipmentId" >
          <el-select v-model="recordsFrom.equipmentId" placeholder="请选择设备" style="width: 100%">
            <el-option v-for="(item,index) in equipmentList" :key="index"  :value="item.ucId" :label="item.name" ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="维保企业" prop="maintenaceEnterprise" >
          <el-select v-model="recordsFrom.maintenaceEnterprise" placeholder="请选择企业" style="width: 100%">
            <el-option v-for="(item,index) in manitenanceEnterpriseList" :key="index"  :value="item.ucId" :label="item.name" ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="设备状态" prop="equipmentStatus">
          <el-select v-model="recordsFrom.equipmentStatus" placeholder="请选择设备状态" style="width: 100%">
            <el-option :value="0" label="良好"></el-option>
            <el-option :value="1" label="损坏"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="维保详情" prop="remark">
          <el-input v-model="recordsFrom.remark" placeholder="请输入维保详情" style="width: 100%"></el-input>
        </el-form-item>
      </el-form>
    </div>
    <div slot="footer" style="text-align: center" class="dialog-footer">
      <el-button @click="cancelCommission">取消</el-button>
      <el-button :loading="addLoading" v-if="createStatus" type="primary" @click="addRecords">创 建
      </el-button>
      <el-button :loading="addLoading" v-else type="primary" @click="updateRecords">更新</el-button>
    </div>
  </div>
</template>

<script>

import {
  addRecords,
  getInMaintenanceRecordVo,
  getInRecordsVo,
  updateRecords
} from "../../../api/maintenanceRecord";
import {getInEnterpriseDominantList} from "../../../api/enterpriseDominant";
import {getInUserList} from "../../../api/enterprise";
import {getEquipmentList} from "../../../api/equipment";
export default {
  name: "edit",
  data(){
    return{
      recordsFrom:{

      },
      recordsFromRules:{
        // designee: [{ required: true, message: '请选择指定人', trigger: 'blur' }],
        enterpriseId: [{ required: true, message: '请选择企业', trigger: 'blur' }],
        // equipmentId: [{ required: true, message: '请选择设备', trigger: 'blur' }],
        manitenanceEnterpriseId: [{ required: true, message: '请选择维保企业', trigger: 'blur' }],
        name: [{ required: true, message: '请输入工单名称', trigger: 'blur' }],
      },
      addLoading:false,
      equipmentList:[],
      enterpriseList:[],
      manitenanceEnterpriseList:[],
      userList:[]

    }
  },
  computed: {
    createStatus(){
      return this.$route.query.ucId==undefined
    }
  },
  created() {
    if(!this.createStatus){
      let ucId =this.$route.query.ucId
      console.log(ucId)
      this.getInRecordsVo(ucId)
    }
    this.getInEnterpriseDominantList();
    this.getEquipmentList();
    this.getInUserList();
    this.getInOwnerDominantList();
  },
  methods:{
    cancelCommission(){
      window.history.back()
    },
    getInRecordsVo(val) {
      getInRecordsVo({ucId: val}).then(res =>{
        console.log(res)
        this.recordsFrom = res.data
      }).catch(res => {
        this.addLoading = false
        this.$notify.error({
          title: '失败',
          message: res.msg
        })
      })
    },
    addRecords() {
      this.addLoading = true
      this.$refs['recordsFrom'].validate(valid => {
        if (valid) {
          addRecords(this.recordsFrom).then(res => {
            this.addLoading = false
            this.$notify.success({
              title: '成功',
              message: "添加维保信息成功"
            })
            this.cancelCommission()
          }).catch(res => {
            this.addLoading = false
            this.$notify.error({
              title: '失败',
              message: res.msg
            })
          })
        } else {
          this.addLoading = false
          console.log("表单验证不通过")
        }
      })
    },
    updateRecords() {
      this.addLoading = true
      this.$refs['recordsFrom'].validate(valid => {
        if (valid) {
          updateRecords(this.recordsFrom).then(res => {
            this.addLoading = false
            this.$notify.success({
              title: '成功',
              message: "更新维保信息成功"
            })
            this.cancelCommission()
          }).catch(res => {
            this.addLoading = false
            this.$notify.error({
              title: '失败',
              message: res.msg
            })
          })
        } else {
          this.addLoading = false
          console.log("表单验证不通过")
        }
      })
    },
    getInEnterpriseDominantList() {
      getInEnterpriseDominantList({dominantType:9,deleted:false}).then(res => {
        this.manitenanceEnterpriseList=res.data;
      }).catch(res => {
        this.addLoading = false
        this.$notify.error({
          title: '失败',
          message: res.msg
        })
      })
    },
    getInOwnerDominantList() {
      getInEnterpriseDominantList({dominantType: 10,deleted : false}).then(res => {
        this.enterpriseList = res.data;
      }).catch (res => {
        this.addLoading = false
        this.$notify.error({
          title: '失败',
          message: res.msg
        })
      })
    },
    getEquipmentList(val) {
      getEquipmentList({deleted:false}).then(res => {
        this.equipmentList = res.data
      }).catch(res => {
        this.addLoading = false
        this.$notify.error({
          title: '失败',
          message: res.msg
        })
      })
    },
    getInUserList() {
      getInUserList({dominantType: 9 ,deleted:false}).then(res => {
        this.userList = res.data
      }).catch(res => {
        this.addLoading = false
        this.$notify.error({
          title: '失败',
          message: res.msg
        })
      })
    },

  }

}
</script>

<style
    scoped>

</style>